<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        body {
            color: #292929;
        }

        .table_title {
            font-weight: bold;
            height: 50px;
            background-color: #dddddd;
        }

        .active {
            background-color: #50abda;
            background-color: rgba(80, 142, 218, 0.2);
        }

        .table_row {
            height: 40px;
        }

        .r_black_title {
            background-color: #4b4b4b;
            width: 100vw;
            height: 80px;
            text-align: center;
            position: absolute;
        }

        .title_btn {
            background: none;
            font-size: 22px;
            border: 0;
            color: #fff;
            margin-top: 10px;
        }

        .title_line {
            background-color: #fff;
            width: 50px;
            height: 5px;
            border-radius: 10px;

            transition: all 0.2s ease;
        }
    </style>
    <link rel="stylesheet" href="/css/style.css" media="screen" type="text/css"/>
    <link rel="stylesheet" type="text/css" href="/css/default.css"/>
    <link rel="stylesheet" type="text/css" href="/css/component.css"/>

</head>

<body class="web-font">
<div class="r_black_title">
    <div>
        <button class="title_btn" id="jihua">全部计划</button>
        <button class="title_btn" id="yonghu">全部用户</button>
        <button class="title_btn" id="rizhi">推送日志</button>
        <button id="push_all" onclick="pushAll()" style="float: right;margin-top: 20px;margin-right: 20px;">全部推送
        </button>
    </div>
    <div class="title_line"/>

</div>

<button id="zhikanhuoyue" style="margin-top: 20px;margin-bottom: 20px;float: left;">只看4天内编辑过的</button>
<#--${name[0].plan.plan_title}-->
<table rules=all style="border: 1px #292929 solid;width: 100%;font-size: 16px;" id="plan_table">
    <script type="text/javascript" src="/js/jquery-3.3.1.min.js"></script>
<#--<script src="/js/index.js"></script>-->
    <script src="/js/modernizr.custom.js"></script>

    <script type="text/javascript">
        var cuPage = 1;
        var cuType = 0;
        var ishuoyue = false;
        // var httpUrl = "https://192.168.1.164:443/templates";
        var httpUrl = "https://www.niurenshuma.cn:443/templates";

        function getMsgLog(page, size) {
            cuPage = page;
            $.ajax({
                // url: "https://www.niurenshuma.cn:443/templates/t",
                url: httpUrl + "/MsgLog",
                data: {
                    pageNum: page,
                    pageSize: size
                },
                type: "post",
                dataType: "json",
                cache: false,
                async: false,
                contentType: 'application/x-www-form-urlencoded',
                success: function (e) {
                    console.log("list", e);

                    $("#plan_table").html("");
                    $("#plan_table").append("<tr  class=\"table_title table_row\">" +
                            " <td style=\"padding-left: 5px;padding-right: 5px;\">错误码</td>" +
                            "<td style=\"padding-left: 5px;padding-right: 5px;\">错误信息</td>" +
                            "< <td style=\"padding-left: 5px;padding-right: 5px;\">接收人</td>" +
                            "< <td style=\"padding-left: 5px;padding-right: 5px;\">发送时间</td>" +
                            "</tr>");
                    var list = e;

                    // document.querySelectorAll( '.md-trigger' )

                    for (var i = 0; i < list.length; i++) {
                        console.log(list[i].error_msg);
                        var msg = "";
                        if (list[i].code == 0) {
                            msg = "成功";
                        } else if (list[i].code == 41029) {
                            msg = "失败，已经发送过1条，等用户再次使用才能发送";
                        } else if (list[i].code == 41028) {
                            msg = "失败，formId过期，等用户再次使用才能发送";
                        } else {
                            msg = "失败，原因未知";
                        }

                        $("#plan_table").append("<tr class=\"table_row md-trigger\">" +
                                "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">" + list[i].code + "</td>" +
                                " <td style=\"width:700px;white-space: nowrap; text-overflow:ellipsis; overflow:hidden;padding-left: 5px;padding-right: 5px;\">" + msg + "</td>" +
                                " <td style=\"padding-left: 5px;padding-right: 5px;\">" + list[i].nick_name + "</td>" +
                                " <td style=\"padding-left: 5px;padding-right: 5px;\">" + list[i].send_time + "</td>" +
                                "</tr>");
                    }
                    $('#pager').html("");
                    for (var i = 0; i < list[0].count / 15; i++) {

                        if (cuPage == (i + 1)) {
                            $('#pager').append("<button style=\"background-color: #484fad\" onclick=\"page(" + (i + 1) + ")\">" + (i + 1) + "</button>")
                        } else {
                            $('#pager').append("<button onclick=\"page(" + (i + 1) + ")\">" + (i + 1) + "</button>")
                        }
                    }
                },
                error: function (e) {
                    alert(e);
                }
            });
        }

        function getPlanList(page, size, ishuoyue) {
            cuPage = page;
            $.ajax({
                // url: "https://www.niurenshuma.cn:443/templates/t",
                url: httpUrl + "/getPlan",
                data: {
                    pageNum: page,
                    pageSize: size,
                    ishuoyue: ishuoyue
                },
                type: "post",
                dataType: "json",
                cache: false,
                async: false,
                contentType: 'application/x-www-form-urlencoded',
                success: function (e) {
                    console.log("list", e);
                    $("#plan_table").html("");
                    $("#plan_table").append("<tr  class=\"table_title table_row\">" +
                            " <td style=\"padding-left: 5px;padding-right: 5px;\">计划id</td>" +
                            "<td style=\"padding-left: 5px;padding-right: 5px;\">计划名称</td>" +
                            "< <td style=\"padding-left: 5px;padding-right: 5px;\">创建人</td>" +
                            "<td style=\"padding-left: 5px;padding-right: 5px;\">合作人</td>" +
                            "<td style=\"padding-left: 5px;padding-right: 5px;\">创建时间</td>" +
                            "<td style=\"padding-left: 5px;padding-right: 5px;\">最后编辑时间</td>" +
                            "<td style=\"padding-left: 5px;padding-right: 5px;\">最后登陆时间</td>" +
                            "</tr>");
                    var list = e;

                    // document.querySelectorAll( '.md-trigger' )

                    for (var i = 0; i < list.length; i++) {
                        $("#plan_table").append("<tr class=\"table_row md-trigger\" data-plan_id=\"" + list[i].plan_id + "\" data-modal=\"modal-1\"  onclick=\"dialog_show()\">" +
                                "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">" + list[i].plan_id + "</td>" +
                                " <td style=\"width:500px;white-space: nowrap; text-overflow:ellipsis; overflow:hidden;padding-left: 5px;padding-right: 5px;\">" + list[i].plan_title + "</td>" +
                                " <td style=\"padding-left: 5px;padding-right: 5px;\">" + list[i].creator + "</td>" +
                                "<td style=\"padding-left: 5px;padding-right: 5px;\">" + list[i].userName + "</td>" +
                                "<td style=\"padding-left: 5px;padding-right: 5px;\">" + list[i].plan_create_time + "</td>" +
                                "<td style=\"padding-left: 5px;padding-right: 5px;\">" + list[i].last_edit_time + "</td>" +
                                "<td style=\"padding-left: 5px;padding-right: 5px;\">" + list[i].last_login_time + "</td>" +
                                "</tr>");
                    }
                    console.log("plan", list);
                    $('#pager').html("");
                    for (var i = 0; i < list[0].count / 15; i++) {
                        if (cuPage == (i + 1)) {
                            $('#pager').append("<button style=\"background-color: #484fad\" onclick=\"page(" + (i + 1) + ")\">" + (i + 1) + "</button>")
                        } else {
                            $('#pager').append("<button onclick=\"page(" + (i + 1) + ")\">" + (i + 1) + "</button>")
                        }
                    }

                    $(".md-close").on('click', function (e) {
                        $("#modal-1").removeClass("md-show");

                        var xx = $('#jihua')[0].offsetLeft;
                        $('.title_line').css("margin-left", xx + 25 + "px");
                    })

                    getTaskClick();
                },
                error: function (e) {
                    alert(e);
                }
            });
        }

        function page(e) {
            if (cuType == 0) {
                getPlanList(e, 15, ishuoyue);
            } else if (cuType == 1) {
                getAllUser(e, 15);
            } else if (cuType == 2) {
                getMsgLog(e, 15);
            }
        }

        function dialog_show() {
            $("#modal-1").addClass("md-show");
        }

        /**
         *  获取任务
         */
        function getTaskClick() {
            $('tr').on('click', function (e) {
                $(this).addClass('active');
                $(this).siblings().removeClass('active');

                console.log("plan_id", e.currentTarget.dataset.plan_id);
                $.ajax({
                    // url: "https://www.niurenshuma.cn:443/templates/t",
                    url: httpUrl + "/t",
                    data: {planId: e.currentTarget.dataset.plan_id},
                    type: "post",
                    dataType: "json",
                    cache: false,
                    async: false,
                    contentType: 'application/x-www-form-urlencoded',
                    success: function (e) {
                        $("#r_table").html("");
                        $("#r_table").append("<tr  class=\"table_title table_row\">" +
                                "<td  style=\"width:300px;white-space: nowrap; text-overflow:ellipsis; overflow:hidden;padding-left: 5px;padding-right: 5px;\">任务名称</td>" +
                                "<td style=\"padding-left: 5px;padding-right: 5px;\">创建时间</td>" +
                                "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">是否完成</td>" +
                                "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">创建人</td>" +
                                "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">最后编辑时间</td>" +
                                "</tr>");
                        var list = e;
                        for (var i = 0; i < list.length; i++) {
                            var strCheck = "否";
                            if (list[i].is_checked) {
                                strCheck = "是";
                            } else {
                                strCheck = "否";
                            }
                            $("#r_table").append("<tr class=\"table_row\">" +
                                    "<td  style=\"width:200px;white-space: nowrap; text-overflow:ellipsis; overflow:hidden;padding-left: 5px;padding-right: 5px;\">" + list[i].task_title + "</td>" +
                                    "<td style=\"width:200px;padding-left: 5px;padding-right: 5px;\">" + list[i].task_create_time + "</td>" +
                                    "<td style=\"width:50px;padding-left: 5px;padding-right: 5px;\">" + strCheck + "</td>" +
                                    "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">" + list[i].creator + "</td>" +
                                    "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">" + list[i].task_last_edit_time + "</td>" +
                                    "</tr>");
                            console.log("task", list[i]);
                        }
                    },
                    error: function (e) {
                        alert(e);
                    }
                });
            })
        }

        /**
         *  获取用户
         */
        function getAllUser(page, size, ishuoyue) {
            cuPage = page;
            $.ajax({
                // url: "https://www.niurenshuma.cn:443/templates/t",
                url: httpUrl + "/getUser",
                data: {
                    pageNum: page,
                    pageSize: size,
                    ishuoyue:ishuoyue
                },
                type: "post",
                dataType: "json",
                cache: false,
                async: false,
                contentType: 'application/x-www-form-urlencoded',
                success: function (e) {

                    $("#plan_table").html("");
                    $("#plan_table").append("<tr  class=\"table_title table_row\">" +
                            "<td  style=\"width:50px;white-space: nowrap; text-overflow:ellipsis; overflow:hidden;padding-left: 5px;padding-right: 5px;\">用户id</td>" +
                            "<td style=\"padding-left: 5px;padding-right: 5px;\">昵称</td>" +
                            "<td style=\"padding-left: 5px;padding-right: 5px;\">创建时间</td>" +
                            "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">最后登录时间</td>" +
                            "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">头像</td>" +
                            "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">formId</td>" +
                            "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">操作</td>" +
                            "</tr>");
                    var list = e;
                    console.log("user", e);

                    for (var i = 0; i < list.length; i++) {
                        var strCheck = "否";
                        if (list[i].is_checked) {
                            strCheck = "是";
                        } else {
                            strCheck = "否";
                        }
                        $("#plan_table").append("<tr class=\"table_row\">" +
                                "<td  style=\"width:50px;white-space: nowrap; text-overflow:ellipsis; overflow:hidden;padding-left: 5px;padding-right: 5px;\">" + list[i].id + "</td>" +
                                "<td style=\"width:200px;padding-left: 5px;padding-right: 5px;\">" + list[i].nick_name + "</td>" +
                                "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">" + list[i].create_time + "</td>" +
                                "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">" + list[i].last_login_time + "</td>" +
                                "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">" + list[i].avatar_url + "</td>" +
                                "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\">" + list[i].form_id + "</td>" +
                                "<td style=\"width:100px;padding-left: 5px;padding-right: 5px;\"><button onclick=\"pushById(" + list[i].id + ")\">推送</button></td>" +
                                "</tr>");
                    }

                    $('#pager').html("");
                    for (var i = 0; i < list[0].count / 15; i++) {
                        if (cuPage == (i + 1)) {
                            $('#pager').append("<button style=\"background-color: #484fad\" onclick=\"page(" + (i + 1) + ")\">" + (i + 1) + "</button>")
                        } else {
                            $('#pager').append("<button onclick=\"page(" + (i + 1) + ")\">" + (i + 1) + "</button>")
                        }
                    }

                },
                error: function (e) {
                    alert(e);
                }
            });
        }

        function pushAll() {

            var r = confirm("确定全部推送？");
            if (r == true) {
                $.ajax({
                    // url: "https://www.niurenshuma.cn:443/templates/t",
                    url: httpUrl + "/pushAll",
                    data: {},
                    type: "post",
                    dataType: "json",
                    cache: false,
                    async: false,
                    contentType: 'application/x-www-form-urlencoded',
                    success: function (e) {
                        console.log("suc", e);
                        alert(e);
                    },
                    error: function (e) {
                        alert(e);
                        console.log("fail", e)
                    }
                });
            }
            else {
            }


        }

        function pushById(user_id) {
            $.ajax({
                // url: "https://www.niurenshuma.cn:443/templates/t",
                url: httpUrl + "/pushById",
                data: {
                    user_id: user_id
                },
                type: "post",
                dataType: "json",
                cache: false,
                async: false,
                contentType: 'application/x-www-form-urlencoded',
                success: function (e) {
                    console.log("suc", e);
                    alert(e);
                },
                error: function (e) {
                    alert(e);
                    console.log("fail", e)
                }
            });
        }

        $(function () {
            var xx = $('#jihua')[0].offsetLeft;
            $('.title_line').css("margin-left", xx + 40 + "px");

            $('button').on('click', function (e) {
                if (e.target.id != 'zhikanhuoyue') {
                    azuo = e.currentTarget.offsetLeft;
                    $('.title_line').css("margin-left", azuo + 40 + "px");
                }

                if (e.target.id == 'yonghu') {
                    console.log("111");
                    getAllUser(1, 15);
                    cuType = 1;
                    cuPage = 1;
                    $('#zhikanhuoyue').text("只看4天内登陆过的用户");
                    $('#zhikanhuoyue').css("background-color", "#50abda");
                    ishuoyue=false;

                } else if (e.target.id == 'jihua') {
                    console.log("222");
                    getPlanList(1, 15, ishuoyue);
                    cuType = 0;
                    cuPage = 1;
                    $('#zhikanhuoyue').text("只看4天内编辑过的");
                    $('#zhikanhuoyue').css("background-color", "#50abda");
                    ishuoyue=false;
                } else if (e.target.id == 'rizhi') {
                    console.log("333");
                    getMsgLog(1, 30);
                    cuType = 2;
                    cuPage = 1;
                    $('#zhikanhuoyue').css("background-color", "#50abda");
                    ishuoyue=false;

                } else if (e.target.id == 'zhikanhuoyue') {
                    console.log("444");
                    ishuoyue = ishuoyue ? false : true;

                    if (ishuoyue) {
                        $('#zhikanhuoyue').css("background-color", "#484fad");
                    } else {
                        $('#zhikanhuoyue').css("background-color", "#50abda");
                    }

                    if (cuType == 0) {
                        getPlanList(1, 15, ishuoyue);
                    } else if (cuType == 1) {
                        getAllUser(1, 15,ishuoyue);
                    }

                }
            })
            $('#jihua').click();
        })
    </script>

</table>
<div id="dialog"></div>

<div class="md-modal md-effect-1" id="modal-1">
    <div class="md-content">
        <h3>任务</h3>
        <div>
            <div style="height:auto;max-height:80vh;overflow:scroll;">
                <table id="r_table" rules=all
                       style="border: 1px #292929 solid;width: 100%;margin-bottom: 20px;font-size: 16px;">
                </table>
            </div>
            <button class="md-close">Close me!</button>
        </div>
    </div>
</div>
<#--${name}-->

<!-- classie.js by @desandro: https://github.com/desandro/classie -->
<script src="/js/classie.js"></script>
<script src="/js/modalEffects.js"></script>

<!-- for the blur effect -->
<!-- by @derSchepp https://github.com/Schepp/CSS-Filters-Polyfill -->
<#--<script>-->
<#--// this is important for IEs-->
<#--var polyfilter_scriptpath = '/js/';-->
<#--</script>-->
<#--<script src="/js/cssParser.js"></script>-->
<#--<script src="/js/css-filters-polyfill.js"></script>-->
<div id="pager" style="margin-top: 20px;">

</div>
</body>
</html>